/**
 * 培训大纲-授权人员
 */
<template>
   <vp-main-page @refresh="loadDataList" :custom="false" :zoom="false">
		<template #table>
			<vp-table ref="tableRef" :data="tableData" :span-method="authUserTableSpanMethod" row-key="id" v-loading="loading">
				<el-table-column prop="sqr" show-overflow-tooltip min-width="125">
					<template #header><vp-label zh="姓名" en="Name"/></template>
				</el-table-column>
				<el-table-column prop="bh" show-overflow-tooltip min-width="125">
					<template #header><vp-label zh="档案编号" en="No."/></template>
					<template #default="scope">
						<el-link  type="text" @click="viewPersonFile(scope.row.sqrdaid)">
							{{scope.row.bh}}
						</el-link>
					</template>
				</el-table-column>
				<el-table-column prop="bm" show-overflow-tooltip min-width="135">
					<template #header><vp-label zh="部门" en="Department"/></template>
				</el-table-column>
				<el-table-column prop="yxqks" show-overflow-tooltip width="140">
					<template #header><vp-label zh="有效期开始" en="Validity Period Start"/></template>
				</el-table-column>
				<el-table-column prop="yxqjz" :label="$t('outline.yxqjz')" show-overflow-tooltip width="140">
					<template #header><vp-label zh="有效期截至" en="Validity Period End"/></template>
				</el-table-column>
				<el-table-column prop="jx" show-overflow-tooltip min-width="110">
					<template #header><vp-label zh="机型" en="A/C Type"/></template>
				</el-table-column>
			</vp-table>
		</template>
	</vp-main-page>
</template>
<script setup lang="ts" name="authorizedPersonTab">
import { computed, defineAsyncComponent, onMounted, reactive, ref, watch } from 'vue';
import router from '/@/router';
import request from '/@/utils/request';

	const props = defineProps({
		positionId: {
			type: String
		},
	});

	const searchForm = reactive({
		gwid: "",
		ztList: [89],
	});
	
	// 监听岗位id改变，则刷新页面
	watch(()=> props.positionId, ()=>{
		loadDataList();
	})

	// 组件挂载后事件
	onMounted(() => {
		loadDataList()
	})

	const tableData = ref([]);
	const loading = ref(false);

	// 扁平化后的数据
	const flattenData = ref([] as any);
	// 合并配置（记录每行需要合并的数量）
	const spanArr = ref([] as any);

	// 加载列表数据
	const loadDataList = () => {
		loading.value = true
		request.get('/training/position/auth/list', {
			params: {
				...searchForm,
				gwId: props.positionId,
			}
		}).then(res => {
			tableData.value = res?.data || [];
		}).finally(()=>{
			loading.value = false
		})
	}

	const authUserSpanArray = computed(()=>{
		let spanArray = {};
		if(tableData.value && tableData.value.length>0){
			let sqrdaid=""
			let yxqks=""
			let yxqjz=""
			let sqrRowIndex=0;
			let sqrRowCount=1;
			let yxqRowIndex=0;
			let yxqRowCount=1;
			for(let i=0; i<tableData.value.length; i++){
				if(i==0){
					sqrdaid=tableData.value[i].sqrdaid;
					yxqks=tableData.value[i].yxqks;
					yxqjz=tableData.value[i].yxqjz;
				}else{
					if(sqrdaid === tableData.value[i].sqrdaid){
						sqrRowCount += 1;
						if(yxqks === tableData.value[i].yxqks && yxqjz === tableData.value[i].yxqjz){
							yxqRowCount += 1;
						}else{
							if(yxqRowCount> 1){
								spanArray[yxqRowIndex+":3"]=yxqRowCount;
								spanArray[yxqRowIndex+":4"]=yxqRowCount;
								for(let j=yxqRowIndex+1; j<i; j++){
									spanArray[j+":3"]=0;
									spanArray[j+":4"]=0;
								}
							}
							yxqks=tableData.value[i].yxqks;
							yxqjz=tableData.value[i].yxqjz;
							yxqRowIndex=i;
							yxqRowCount=1;
						}
					}else{
						if(sqrRowCount > 1){
							spanArray[sqrRowIndex+":0"]=sqrRowCount;
							spanArray[sqrRowIndex+":1"]=sqrRowCount;
							spanArray[sqrRowIndex+":2"]=sqrRowCount;
							for(let j=sqrRowIndex+1; j<i; j++){
								spanArray[j+":0"]=0;
								spanArray[j+":1"]=0;
								spanArray[j+":2"]=0;
							}
						}
						if(yxqRowCount> 1){
							spanArray[yxqRowIndex+":3"]=yxqRowCount;
							spanArray[yxqRowIndex+":4"]=yxqRowCount;
							for(let j=yxqRowIndex+1; j<i; j++){
								spanArray[j+":3"]=0;
								spanArray[j+":4"]=0;
							}
						}
						sqrdaid=tableData.value[i].sqrdaid;
						yxqks=tableData.value[i].yxqks;
						yxqjz=tableData.value[i].yxqjz;
						sqrRowIndex=i;
						sqrRowCount=1;
						yxqRowIndex=i;
						yxqRowCount=1;
					}
				}
			}
			if(sqrRowCount > 1){
				spanArray[sqrRowIndex+":0"]=sqrRowCount;
				spanArray[sqrRowIndex+":1"]=sqrRowCount;
				spanArray[sqrRowIndex+":2"]=sqrRowCount;
				for(let j=sqrRowIndex+1; j<tableData.value.length; j++){
					spanArray[j+":0"]=0;
					spanArray[j+":1"]=0;
					spanArray[j+":2"]=0;
				}
			}
			if(yxqRowCount> 1){
				spanArray[yxqRowIndex+":3"]=yxqRowCount;
				spanArray[yxqRowIndex+":4"]=yxqRowCount;
				for(let j=yxqRowIndex+1; j<tableData.value.length; j++){
					spanArray[j+":3"]=0;
					spanArray[j+":4"]=0;
				}
			}
		}
		return spanArray;
	})

	const authUserTableSpanMethod = ({ row, column, rowIndex, columnIndex })=>{
		if(tableData.value && tableData.value.length>0){
			if(authUserSpanArray.value[rowIndex+":"+columnIndex] >0){
				return [authUserSpanArray.value[rowIndex+":"+columnIndex], 1]
			}else if(authUserSpanArray.value[rowIndex+":"+columnIndex] === 0){
				return [0,0];
			}else{
				return [1, 1]
			}
		}
	}

	const viewPersonFile = (daid: string) =>{
		router.push({
			name: "viewTrainingPersonnelFile",
			params: {
				id: daid,
			},
		})
	}
</script>
